<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:s="http://jboss.com/products/seam/taglib"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:rich="http://richfaces.org/rich" template="layout/template.xhtml">

	<ui:define name="body">

		<script>
			function Confirmar(params) {

		    	this.mensaje = params.mensaje;
		    
		    	this.ejecutar = function() {
		
		        	return confirm(this.mensaje);
			    }
			}
		
			var confirmarBorrarVenta = new Confirmar( {	mensaje : "Esta seguro que desea remover este articulo?" });
			var confirmarCambiarArticulo = new Confirmar( {	mensaje : "Esta seguro que desea cambiar el articulo?" });
		
		</script>

		<h:form>

			<rich:panel>

				<f:facet name="header">Cambio</f:facet>
				<h:panelGrid columns="2">

					<rich:panel>

						<h:panelGrid>

							<h2>Articulo devuelto</h2>

							<s:decorate id="fecha" template="layout/display.xhtml">
								<ui:define name="label">Fecha</ui:define>
								<h:outputText value="#{ventaHome.instance.fecha}">
									<s:convertDateTime type="both" dateStyle="short"
										pattern="dd/MM/yyyy" />
								</h:outputText>
							</s:decorate>

							<s:decorate id="descuento" template="layout/display.xhtml">
								<ui:define name="label">Descuento</ui:define>
								<h:outputText value="#{ventaHome.instance.descuento} %">
								</h:outputText>
							</s:decorate>

							<s:decorate id="tipopago" template="layout/display.xhtml">
								<ui:define name="label">Tipo de pago</ui:define>
								<h:outputText
									value="#{ventaHome.instance.tipoPago.sigla} - #{ventaHome.instance.tipoPago.descripcion}">
								</h:outputText>
							</s:decorate>

							<s:decorate id="recargo" template="layout/display.xhtml">
								<ui:define name="label">Recargo</ui:define>
								<h:outputText value="#{ventaHome.instance.tipoPago.recargo} %">
								</h:outputText>
							</s:decorate>

							<s:decorate id="precioDeVenta" template="layout/display.xhtml">
								<ui:define name="label">Precio de venta</ui:define>
								<h:outputText value="$ #{ventaHome.instance.precioDeVenta}" />
							</s:decorate>
						</h:panelGrid>

						<div style="height: 8px" />

						<h:panelGrid>

							<h3>Detalles del Articulo</h3>

							<s:decorate id="codigoArticulo" template="layout/display.xhtml">
								<ui:define name="label">Codigo</ui:define>
								<h:outputText
									value="#{formateadorDeCodigos.formatearCodigo(ventaHome.instance.compra.articulo.codigoArticulo,5)}" />
							</s:decorate>

							<s:decorate id="descripcionArticulo"
								template="layout/display.xhtml">
								<ui:define name="label">Descripcion</ui:define>
								<h:outputText
									value="#{ventaHome.instance.compra.articulo.descripcion}" />
							</s:decorate>

							<s:decorate id="tipoArticulo" template="layout/display.xhtml">
								<ui:define name="label">Tipo</ui:define>
								<h:outputText
									value="#{ventaHome.instance.compra.articulo.tipoArticulo}" />
							</s:decorate>

							<s:decorate id="numeroArticulo" template="layout/display.xhtml">
								<ui:define name="label">Numero</ui:define>
								<h:outputText value="#{ventaHome.instance.compra.numero}" />
							</s:decorate>



						</h:panelGrid>

						<div style="clear: both" />

					</rich:panel>

					<rich:panel>

						<h2>Nuevos articulos</h2>

						<h:outputText
							value="Todavia no se selecciono ningun nuevo articulo"
							style="FONT-WEIGHT: bold; COLOR: #ff0000;"
							rendered="#{empty cargaCambio.nuevasVentas}" />

						<h:panelGrid rendered="#{not empty cargaCambio.nuevasVentas}">
							<rich:dataTable id="nuevasVentas" var="_venta"
								value="#{cargaCambio.nuevasVentas}">

								<rich:column>
									<f:facet name="header">Codigo</f:facet>
									<h:outputText
										value="#{relacionCompraCodigoUnicoHome.obtenerCodigoUnicoParaCompra(_venta.compra)}" />
								</rich:column>

								<rich:column>
									<f:facet name="header">Articulo</f:facet>
									<h:outputText value="#{_venta.compra.articulo.descripcion}" />
								</rich:column>

								<rich:column>
									<f:facet name="header">Numero</f:facet>
									<h:outputText value="#{_venta.compra.numero}" />
								</rich:column>

								<rich:column>
									<f:facet name="header">Precio</f:facet>
									<h:outputText value="$ #{_venta.precioDeVenta}" />
								</rich:column>

								<rich:column>
									<f:facet name="header">Accion</f:facet>
									<h:commandLink value="Remover"
										onclick="return confirmarBorrarVenta.ejecutar();"
										action="#{cargaCambio.removerArticulo(_venta)}" />
								</rich:column>

							</rich:dataTable>

							<s:div style="height:8px" />

						</h:panelGrid>

						<rich:panel>

							<h:outputText value="Dinero disponible para el comprador: $ #{cargaCambio.diferencia}" />
						</rich:panel>

						<div style="height: 8px" />

						<h:commandButton action="/CargaCambio.xhtml" id="agregar"
							value="Agregar articulo" />
					</rich:panel>
				</h:panelGrid>
			</rich:panel>

			<div class="actionButtons"><h:commandButton
				rendered="#{not empty cargaCambio.nuevasVentas}"
				action="#{cargaCambio.aceptarCambio()}" id="cambiar"
				onclick="return confirmarCambiarArticulo.ejecutar();"
				value="Cambiar articulo" /> <h:commandButton action="/home.xhtml"
				id="cancelar" value="Cancelar"/></div>

		</h:form>
	</ui:define>

</ui:composition>
